<template>
	<view>
		<u-navbar bgColor="transparent" titleStyle="color:#fff" title="提现" leftIconColor="#fff" :autoBack="true">
		</u-navbar>

		<view style="position: relative;">
			<image src="https://bhzhtc.oss-cn-beijing.aliyuncs.com/sxsd/31ec0fe9386e47d4ae06bebcd18fddce.png"
				style="width: 750rpx;" mode="widthFix"></image>
			<view class="home-total">
				<view>{{userInfo.balance}}</view>
				<view style="font-size: 28rpx;margin-top: 10rpx;">我的余额(元)</view>
			</view>
		</view>
		<view class="withdraw-con">
			<view>提现金额</view>
			<view class="con-middle">
				<view style="color: #000000;font-size: 30rpx;font-weight: 500;">¥</view>
				<view class="with-input"><u--input placeholder="请输入提现金额" border="none" v-model="moneyValue"
						fontSize="14px" placeholderStyle="color:#999999;"></u--input></view>
				<view style="color: #2FCC71;font-size: 27rpx;margin-left: auto;" @click="moneyValue=money">全部提现</view>
			</view>
			<u-line color="#d8d8d8"></u-line>
			<view style="margin-top: 23rpx;color: #999999;font-weight: 400;font-size: 25rpx;">预计2小时内到账</view>
		</view>
		<view class="withdraw-bom" @click="showBank=true">
			<view style="color: #333333; ;font-size: 27rpx;">提现方式</view>
			<!-- <image :src="src" style="width: 30rpx;height: 30rpx;margin-left: auto;"></image> -->
			<view v-if="name" style="color: #333333; ;font-size: 27rpx;margin-left: auto;">{{name}}</view>
			<view v-else style="margin-left: auto;color: #999999;font-size: 14px;">请选择提现方式</view>
			<u-icon name="arrow-right" color="#999999" size="18"></u-icon>
		</view>

	</view>
</template>

<script>
	import {
		mapGetters,
	} from 'vuex'
	export default {
		data() {
			return {
				moneyValue: ''
			}
		},
		computed: mapGetters(['userInfo']),
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.home-total {
		position: absolute;
		width: 750rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		top: 200rpx;
		left: 0;
		color: #FFFFFF;
		font-size: 45rpx;
	}

	.withdraw-con {
		width: 688rpx;
		background: #ffffff;
		border-radius: 19rpx;
		margin: 0 auto;
		padding: 23rpx;
		box-sizing: border-box;
		position: relative;
		z-index: 2;
		margin-top: -120rpx;
		font-weight: 500;
		color: #333333;
		font-size: 31rpx;
	}

	.withdraw-bom {
		width: 688rpx;
		background: #ffffff;
		border-radius: 19rpx;
		margin: 0 auto;
		margin-top: 46rpx;
		display: flex;
		align-items: center;
		padding: 23rpx;
		box-sizing: border-box;
	}

	.con-middle {
		display: flex;
		align-items: center;
		margin-top: 38rpx;
		margin-bottom: 15rpx;
	}

	.with-input {
		width: 400rpx;
		margin-left: 15rpx;
	}
</style>